﻿@*@{
    Layout = null;
    var AmdinRoleList = @ViewBag.AdminRoleList;
    var count = ViewBag.count;
}*@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="renderer" content="webkit|ie-comp|ie-stand" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link href="~/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/Content/style.css" />
    <link href="~/assets/css/codemirror.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/assets/css/ace.min.css" />
    <link rel="stylesheet" href="~/font/css/font-awesome.min.css" />
    <link rel="stylesheet" href="~/layui/css/layui.css" />
    <!--[if lte IE 8]>
      <link rel="stylesheet" href="~/assets/css/ace-ie.min.css" />
    <![endif]-->
    <script type="text/javascript" src="~/Scripts/jquery-3.3.1.min.js"></script>
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>
    <script src="~/assets/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="~/Widget/Validform/5.3.2/Validform.min.js"></script>
    <script src="~/assets/js/typeahead-bs2.min.js"></script>
    <script src="~/assets/js/jquery.dataTables.min.js"></script>
    <script src="~/assets/js/jquery.dataTables.bootstrap.js"></script>
    <script src="~/assets/layer/layer.js" type="text/javascript"></script>
    <script src="~/Scripts/lrtk.js" type="text/javascript"></script>
    <script src="~/assets/layer/layer.js" type="text/javascript"></script>
    <script src="~/assets/laydate/laydate.js" type="text/javascript"></script>
    <script src="~/layui/layui.js" type="text/javascript"></script>
    <script src="~/Timejs/Time.js" type="text/javascript"></script>
    <title>管理员</title>
</head>

<body>
    <div class="page-content clearfix">
        <div class="administrator">
            <div class="d_Confirm_Order_style">
                <div class="search_style">

                    <ul class="search_content clearfix">
                        <li><label class="l_f">管理员名称</label><input name="" type="text" class="text_add" placeholder="" style=" width:400px" /></li>
                        <li><label class="l_f">添加时间</label><input class="inline laydate-icon" id="start" style=" margin-left:10px;" /></li>
                        <li style="width:90px;"><button type="button" class="btn_search"><i class="fa fa-search"></i>查询</button></li>
                    </ul>
                </div>
                <!--操作-->
                <div class="border clearfix">
                    <span class="l_f">
                        <a href="javascript:ovid()" id="administrator_add" class="btn btn-warning"><i class="fa fa-plus"></i> 添加管理员</a>
                        <a href="javascript:ovid()" id="DelByID" class="btn btn-danger"><i class="fa fa-trash"></i> 批量删除</a>
                    </span>
                    <span class="r_f">共：<b>5</b>人</span>
                </div>
                <!--管理员列表-->
                <div class="clearfix administrator_style" id="administrator">
                    <div class="left_style">
                        <div id="scrollsidebar" class="left_Treeview">
                            <div class="show_btn" id="rightArrow"><span></span></div>
                            <div class="widget-box side_content">
                                <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
                                <div class="side_list">
                                    <div class="widget-header header-color-green2"><h4 class="lighter smaller">管理员分类列表</h4></div>
                                    <div class="widget-body">
                                        <ul class="b_P_Sort_list">
                                            <li><i class="fa fa-users green"></i> <a href="#">全部管理员 ( )</a></li>
                                            @*@foreach (var item in @AmdinRoleList)
                                            {
                                                <li><i class="fa fa-users orange"></i> <a href="#">@item.RoleAdmin (@item.count)</a></li>
                                            }*@
                                            <li><i class="fa fa-users green"></i> <a href="#">全部管理员（13）</a></li>
                                                <li><i class="fa fa-users orange"></i> <a href="#">超级管理员（1）</a></li>
                                                <li><i class="fa fa-users orange"></i> <a href="#">普通管理员（5）</a></li>
                                                <li><i class="fa fa-users orange"></i> <a href="#">产品编辑管理员（4）</a></li>
                                                <li><i class="fa fa-users orange"></i> <a href="#">管理员（1）</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="table_menu_list" id="testIframe">
                        <table class="layui-hide" id="test" lay-filter="demo"></table>

                        <script id="barDemo" type="text/html">
                            <a class="layui-btn layui-btn-xs" lay-event="status">启用</a>
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
                            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                        </script>

                        <script type="text/html" id="switchTpl">
                            <!-- 这里的 checked 的状态只是演示 -->
                            <input type="checkbox" id="{{d.Id}}" name="sex" value="{{d.States}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="sexDemo" {{ d.States == 1 ? 'checked' : '' }}/>
                        </script>

                    </div>
                </div>
            </div>
        </div>
        <!--添加管理员   action="/AdminInfo/InsertAdminInfo" method="post"-->
        <div id="add_administrator_style" class="add_menber" style="display:none">
            <form id="form-admin-add" action="/AdminInfo/InsertAdminInfo" method="post">
                <input type="hidden" value="" placeholder=" " id="Id" name="Id" nullmsg="" />
                <div class="form-group">
                    <label class="form-label"><span class="c-red">*</span>管理员：</label>
                    <div class="formControls">
                        <input type="text" class="input-text" value="" placeholder="" id="user-name" name="AdminName" datatype="*2-16" nullmsg="用户名不能为空" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label"><span class="c-red">*</span>初始密码：</label>
                    <div class="formControls">
                        <input type="password" placeholder="密码" id="userpassword" name="AdminPwd" autocomplete="off" value="" class="input-text" datatype="*6-20" nullmsg="密码不能为空" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label "><span class="c-red">*</span>确认密码：</label>
                    <div class="formControls ">
                        <input type="password" placeholder="确认新密码" autocomplete="off" class="input-text Validform_error" errormsg="您两次输入的新密码不一致！" datatype="*" nullmsg="请再输入一次新密码！" recheck="AdminPwd" id="newpassword2" name="newpassword2" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label "><span class="c-red">*</span>性别：</label>
                    <div class="formControls  skin-minimal">
                        <!--form-field-radio-->
                        <label><input id="baomi" name="Sex" value="2" type="radio" class="ace" checked="checked" /><span class="lbl">保密</span></label>&nbsp;&nbsp;
                        <label><input id="boy" name="Sex" value="1" type="radio" class="ace" /><span class="lbl">男</span></label>&nbsp;&nbsp;
                        <label><input id="nv" name="Sex" value="0" type="radio" class="ace" /><span class="lbl">女</span></label>
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label "><span class="c-red">*</span>手机：</label>
                    <div class="formControls ">
                        <input type="text" class="input-text" value="" placeholder="" id="user-tel" name="Phone" datatype="m" nullmsg="手机不能为空" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label"><span class="c-red">*</span>邮箱：</label>
                    <div class="formControls ">
                        <input type="text" class="input-text" placeholder="" name="Email" id="email" datatype="e" nullmsg="请输入邮箱！" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label">角色：</label>
                    <div class="formControls ">
                        <span class="select-box" style="width:150px;">
                            <!--admin-role-->
                            <select class="select" name="RoleId" size="1">
                                <option value="1">超级管理员</option>
                                <option value="2">普通管理员</option>
                                <option value="3">产品编辑管理员</option>
                                <option value="4">栏目编辑</option>
                            </select>
                        </span>
                    </div>
                </div>
                <div class="form-group">
                    <label class="form-label">备注：</label>
                    <div class="formControls">
                        <textarea name="Context" cols="" rows="" class="textarea" placeholder="说点什么...100个字符以内" dragonfly="true" onkeyup="checkLength(this);"></textarea>
                        <span class="wordage">剩余字数：<span id="sy" style="color:Red;">100</span>字</span>
                    </div>
                    <div class="col-4"> </div>
                </div>
                <div>
                    <input class="btn btn-primary radius" type="submit" id="Add_Administrator" value="&nbsp;&nbsp;提交&nbsp;&nbsp;" />
                </div>
            </form>
    </div>
</body>
</html>
<script type="text/javascript">
    jQuery(function ($) {
        var oTable1 = $('#sample_table').dataTable({
            "aaSorting": [[1, "desc"]],//默认第几个排序
            "bStateSave": true,//状态保存
            "aoColumnDefs": [
                //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
                { "orderable": false, "aTargets": [0, 2, 3, 4, 5, 7, 8,] }// 制定列不参与排序
            ]
        });


        $('table th input:checkbox').on('click', function () {
            var that = this;
            $(this).closest('table').find('tr > td:first-child input:checkbox')
                .each(function () {
                    this.checked = that.checked;
                    $(this).closest('tr').toggleClass('selected');
                });

        });


        $('[data-rel="tooltip"]').tooltip({ placement: tooltip_placement });
        function tooltip_placement(context, source) {
            var $source = $(source);
            var $parent = $source.closest('table')
            var off1 = $parent.offset();
            var w1 = $parent.width();

            var off2 = $source.offset();
            var w2 = $source.width();

            if (parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2)) return 'right';
            return 'left';
        }
    });

</script>
<script type="text/javascript">
    $(function () {
        $("#administrator").fix({
            float: 'left',
            //minStatue : true,
            skin: 'green',
            durationTime: false,
            spacingw: 50,//设置隐藏时的距离
            spacingh: 270,//设置显示时间距
        });
    });
    //字数限制
    function checkLength(which) {
        var maxChars = 100; //
        if (which.value.length > maxChars) {
            layer.open({
                icon: 2,
                title: '提示框',
                content: '您输入的字数超过限制!',
            });
            // 超过限制的字数了就将 文本框中的内容按规定的字数 截取
            which.value = which.value.substring(0, maxChars);
            return false;
        } else {
            var curr = maxChars - which.value.length; //250 减去 当前输入的
            document.getElementById("sy").innerHTML = curr.toString();
            return true;
        }
    };
    //初始化宽度、高度
    $(".widget-box").height($(window).height() - 215);
    $(".table_menu_list").width($(window).width() - 260);
    $(".table_menu_list").height($(window).height() - 215);
    //当文档窗口发生改变时 触发
    $(window).resize(function () {
        $(".widget-box").height($(window).height() - 215);
        $(".table_menu_list").width($(window).width() - 260);
        $(".table_menu_list").height($(window).height() - 215);
    })
    laydate({
        elem: '#start',
        event: 'focus'
    });

    /*用户-停用*/
    function member_stop(obj, id) {
        layer.confirm('确认要停用吗？', function (index) {
            $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,id)" href="javascript:;" title="启用"><i class="fa fa-close bigger-120"></i></a>');
            $(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已停用</span>');
            $(obj).remove();
            layer.msg('已停用!', { icon: 5, time: 1000 });
        });
    }
    /*用户-启用*/
    function member_start(obj, id) {
        layer.confirm('确认要启用吗？', function (index) {
            $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs btn-success" onClick="member_stop(this,id)" href="javascript:;" title="停用"><i class="fa fa-check  bigger-120"></i></a>');
            $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
            $(obj).remove();
            layer.msg('已启用!', { icon: 6, time: 1000 });
        });
    }
    /*产品-编辑*/
    function member_edit(title, url, id, w, h) {
        layer_show(title, url, w, h);
    }

    /*产品-删除*/
    function member_del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
            $(obj).parents("tr").remove();
            layer.msg('已删除!', { icon: 1, time: 1000 });
        });
    }
    /*添加管理员*/
    $('#administrator_add').on('click', function () {
        $(".textarea").attr("disabled", false).val(" ");
        $("#add_administrator_style input").attr("disabled", false).val(" ");
        $(".select").attr("disabled", false).val(" ");
        $("#Add_Administrator").css("display", "block");
        $("#Add_Administrator").val("提交");
        $("#form-admin-add").removeAttr("action");
        $("#form-admin-add").attr("action", "/AdminInfo/InsertAdminInfo")
        layer.open({
            type: 1,
            title: '添加管理员',
            area: ['700px', ''],
            shadeClose: false,
            content: $('#add_administrator_style'),

        });
    })
    //表单验证提交
    $("#form-admin-add").Validform({
        tiptype: 2,
        ajaxPost: true,
        callback: function (data) {
            if (data.status == "y") {
                layer.msg("成功", { icon: 1, time: 1000 }, function () {
                    location.reload();//刷新页面
                });
            }
            else {
                layer.msg("失败", { icon: 0, time: 3000 });
            }
            var index = parent.$("#iframe").attr("src");
            parent.layer.close(index);
        }

    });
</script>
<script>
    layui.use('table', function () {
        var table = layui.table
        ,form = layui.form;
        table.render({
            elem: '#test'
            , url: '/AdminInfo/layuiAdminInfo/'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , cols: [[
                  {type:'checkbox'}
                , { field: 'Id', width: 40,align:'center', title: '编号', sort: true }
                , { field: 'AdminName',align:'center', width: 70, title: '登录名' }
                , { field: 'Phone', width: 130, title: '手机', sort: true }
                , { field: 'Email', width: 140, title: '邮箱' }
                , { field: 'RoleId', title: '角色',align:'center', width: '10%', minWidth: 70 } //minWidth：局部定义当前单元格的最小宽度，layui 2.2.1 新增
                , { field: 'CreateTime',width:160,align:'center',templet:"<div>{{Format(d.CreateTime, 'yyyy-MM-dd hh:mm:ss')}}</div>",title: '加入时间', sort: true }
                , { field: 'States',width: 90,align:'center', title: '状态', templet: '#switchTpl', unresize: true }
                , {fixed: 'right', width:195, align:'center', toolbar: '#barDemo'}
            ]]
            , page: true
            , id:'testReload'
        });
        //批量删除
        $("#DelByID").click(function () {
            //获取表格复选框的数据集合 checkStatus('testReload');
            var checkStatus = table.checkStatus('testReload');
            var data = checkStatus.data;
            var AdminId ="";
            if (data.length == 0) {
                layer.msg("请选中一行",
                    {
                        icon: 0,
                        time: 2000
                    });
                return;
            }
            for (var i in data) {
                if (i == data.length - 1) {
                    AdminId += data[i].Id;
                }
                else {
                    AdminId += data[i].Id + ",";
                }
            };
            layer.confirm('确认要删除吗？', function () {
                $.ajax({
                    url: "/AdminInfo/DelByID?AdminID="+AdminId,
                    type: "post",
                    success: function (result) {
                        if (result.Success) {
                            layer.msg("批量删除成功", { icon: 1, time: 1000 }, function () {
                                location.reload();//刷新页面
                            });
                        }
                        else {
                            layer.msg("批量删除失败", { icon: 0, time: 3000 });
                        }
                    }
                })
            });
        });
        //监听工具条
        table.on('tool(demo)', function(obj){
            var AdminInfo = obj.data;
            var ID=AdminInfo.Id;
            if (obj.event === 'status') {
                //修改管理员状态
                UpdateStates(ID);
            } else if (obj.event === 'detail') {
                //查看管理员信息
                HtmlAdminInfo(AdminInfo);
                $(".textarea").attr("disabled", true);
                $("#add_administrator_style input").attr("disabled", true);
                $(".select").attr("disabled", true);
                $("#Add_Administrator").css("display", "none");
                layer.open({
                    type: 1,
                    title: '添加管理员',
                    area: ['700px', ''],
                    shadeClose: false,
                    content: $('#add_administrator_style'),
                });
                //layer.msg('ID：' + AdminInfo.Id + ' 的查看操作');
            } else if(obj.event === 'del'){
                layer.confirm('真的删除行么', function (index) {
                //删除管理员信息
                DeleteAdminInfo(ID);
                layer.close(index);
                });
            } else if (obj.event === 'edit') {
                //编辑管理员信息/AdminInfo/InsertAdminInfo
                //调用显示表单所有值的方法
                HtmlAdminInfo(AdminInfo);
                $("#Id").val(ID);
                $(".textarea").attr("disabled", false);
                $("#add_administrator_style input").attr("disabled", false);
                $(".select").attr("disabled", false);
                $("#Add_Administrator").css("display", "block");
                $("#Add_Administrator").val("保存修改");
                $("#form-admin-add").removeAttr("action");
                $("#form-admin-add").attr("action","/AdminInfo/UpdateTableAdminInfo")
                layer.open({
                    type: 1,
                    title: '添加管理员',
                    area: ['700px', ''],
                    shadeClose: false,
                    content: $('#add_administrator_style'),
                });
                //layer.alert('编辑行：<br>'+ JSON.stringify(data))
             }
        });
        //监听启用
        form.on('switch(sexDemo)', function (obj) {
           layer.tips(this.value + ' ' + this.name + '：'+ obj.elem.checked, obj.othis);
        var tip = "启用";
        var id = this.id;
        var status = this.value;
        if (this.value === "1") {
            tip = "停用";
            status = 0;
        }
        else {
            status = 1;
        }
        //启用的功能代码
        layer.confirm('真的要' + tip+'吗', function (index) {
            $.ajax({
                url: "/AdminInfo/UpdateAdminInfoStates?id=" + id + "&status=" + status,
                type: "Post",
                success: function (data) {
                    if (data.Success) {
                        layer.msg(tip+'成功！', {
                            title: '提示框',
                            icon: 1,
                            time: 2000
                        }, function () {
                            location.reload();//刷新页面
                            layer.close(index);
                        });
                    }
                    else {
                        layer.msg(tip +'失败！', {
                            title: '提示框',
                            icon: 1,
                            time: 2000
                        });
                    }
                }
            });
        });
    });
    });
    //页面显示管路员信息表的值
    function HtmlAdminInfo(AdminInfo) {
        $("#user-name").val(AdminInfo.AdminName);
        $("#userpassword").val(AdminInfo.AdminPwd);
        $("#newpassword2").val(AdminInfo.AdminPwd);
          if (AdminInfo.Sex == 2) {
                $("#baomi").attr("Checked", true);
          } else if (AdminInfo.Sex == 1) {
                $("#boy").attr("Checked", true);
          } else {
                $("#nv").attr("Checked", true);
          }
        $("#user-tel").val(AdminInfo.Phone);
        $("#email").val(AdminInfo.Email);
        $(".select").select.index=AdminInfo.RoleId;

        $(".textarea").val(AdminInfo.Context);
    }
    //修改管理员状态
    function UpdateStates(ID) {
        $.ajax({
            url: "/AdminInfo/UpdateAdminInfoStates?ID=" +ID,
            type: "post",
            success: function (result) {
                if (result.Success) {
                   layer.msg("修改成功", { icon: 1, time: 1000 }, function () {
                   location.reload();//刷新页面
                });
                }
                else {
                    layer.msg("修改失败", { icon: 0, time: 3000 });
                }
            }
        })
        }
    //删除管理员信息
    function DeleteAdminInfo(ID) {
        $.ajax({
            url: "/AdminInfo/DeleteAdminInfo?ID=" + ID,
            type: "post",
            success: function (result) {
                if (result.Success) {
                   layer.msg("删除成功", { icon: 1, time: 1000 }, function () {
                    location.reload();//刷新页面
                });
                }
                else {
                    layer.msg("删除失败", { icon: 0, time: 3000 });
                }
            }
        })
    }
    $(function () {
        $(".btn_search").click(function () {
            //根据的管理员用户名与时间刷新列表信息
            TableReload();
        });
    })
    //第一种ajax提交添加管理员的方式
    function oddAjax() {
        //$("#Add_Administrator").click(function () {
        //    var AdminInfo = {};
        //    AdminInfo.AdminName = $("#user-name").val();
        //    AdminInfo.AdminPwd = $("#userpassword").val();
        //    AdminInfo.Sex = 2;
        //    if ($("#boy").is(":Checked")) { AdminInfo.Sex = 1 };
        //    if ($("#nv").is(":Checked")) { AdminInfo.Sex = 0 };
        //    AdminInfo.Phone = $("#user-tel").val();
        //    AdminInfo.Email = $("#email").val();
        //    AdminInfo.RoleId = $(".select").select.index + 1;
        //    AdminInfo.Context = $(".textarea").val();
        //    $.ajax({
        //        url: "/AdminInfo/InsertAdminInfo",
        //        type: "post",
        //        data: AdminInfo,
        //        success: function (result) {
        //            if (result.Success) {
        //                layer.msg("管理员添加成功", { icon: 1, time: 1000 }, function () {
        //                    location.reload();//刷新页面
        //                });
        //            }
        //            else {
        //                layer.msg("管理员添加失败", { icon: 0, time: 3000 });
        //            }
        //        }
        //    })
        //})
    }
</script>

